<template>
  <div class="app">
    <h3>我是App组件（祖）</h3>
    <suspense>
      <template v-slot:default>
        <Child />
      </template>
      <template v-slot:fallback>
        <h3>稍等加载中</h3>
      </template>

    </suspense>


  </div>

</template>
<script>
  //import Child from "@/components/Child.vue";
  import {defineAsyncComponent} from "vue";
  //defineAsyncComponent异步引入
  const Child = defineAsyncComponent(()=>{
    return import('@/components/Child.vue')
  })
  export default {
    name: 'App',
    components:{Child},




  }
</script>
<style>
.app{
  background-color: gray;
  padding: 10px;
}
</style>


